<template>
  <div class="micro-app w1200" v-loading="loading">
    <!-- <h1>子应用</h1> -->
    <!--
      name(必传)：应用名称，每个`name`都对应一个应用，必须以字母开头，且不可以带有 `.`、`#` 等特殊符号
      url(必传)：页面html的地址
      baseroute(可选)：基座应用分配给子应用的路由前缀，就是上面的my-page
     -->
     <!-- http://music.boycot.top/ -->
    <micro-app
    v-for="app in list"
    :key="app.name"
    v-bind="{
        ...app
    }"
    @mounted="onReady"
    ></micro-app>
  </div>
</template>
<style lang="less">
.night {
    .micro-app {
        .img, img {
            filter: invert(1) hue-rotate(180deg);
        }
        .grid-list {
            filter: invert(1) hue-rotate(180deg);
        }
    }
}
.micro-app {
    min-height: 700px;
    text-align: left;
    width: 985px;
    box-sizing: content-box;
    .cloud_music {
        height: 700px;
        width: 100%;
        .music-client .music-box {
            height: 700px;
            width: 100%;
        }
        .music-home .swiper-container .swiper-slide .title {
            right: 443px;
        }
        .music-home .swiper-container .swiper-slide-active .title {
            right: 262px;
        }
        .music-home .tab-cate-content .mask-cate .content .right .cates-item {
            height: 32px;
            width: 88px;
        }
    }
    // .theme-dialog,
    .weather-component
     {
        display: none;
    }
    .song-detail-list .cover .text .operation .play-btn {
        min-width: 127px;
    }
    .grid-list-item.type-2 {
        width: 365px;
    }
}
</style>
<script>
import config from '@/config'
export default {
    data () {
        return {
            list: config.microApp.apps,
            loading: true

        }
    },
    mounted () {
        // setTimeout(() => {
        //     this.loading = false
        // }, 800)
    },
    methods: {
        onReady () {
            this.loading = false
        }
    }
}
</script>
